
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="_csrf" th:content="${_csrf.token}" />
<meta name="_csrf_header" th:content="${_csrf.headerName}" />
<link rel="stylesheet"
	th:href="@{/static/bootstrap/css/bootstrap.min.css}" />
<link th:href="@{/static/css/blog.css}" rel="stylesheet">

<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
	  <script th:src="@{/static/js/html5shiv.min.js}"></script>
	  <script th:src="@{/static/js/respond.min.js}"></script>
	<![endif]-->
<link th:href="@{/static/codemirror/lib/codemirror.css}"
	rel="stylesheet">
<link th:href="@{/static/codemirror/addon/display/fullscreen.css}"
	rel="stylesheet">

<link rel="stylesheet"
	th:href="@{/static/codemirror/addon/dialog/dialog.css}">
<link rel="stylesheet"
	th:href="@{/static/codemirror/addon/hint/show-hint.css}">
<link rel="stylesheet"
	th:href="@{/static/codemirror/addon/search/matchesonscrollbar.css}">
<link rel="stylesheet" th:href="@{/static/codemirror/theme/eclipse.css}"/>
<title>文件编辑</title>
</head>
<body>

	<div class="container">
		<div class="alert alert-info"
			style="z-index: 99; position: fixed; right: 50px">
			<button type="button" class="close" data-dismiss="alert"
				aria-label="Close" style="margin-left:10px">
				<span aria-hidden="true">&times;</span>
			</button>
			Ctrl + S: 保存文件<br>
			Alt + F: 寻找文本<br>
			Shift + Ctrl + F: 替换单个文本<br>
			Shift + Ctrl + R: 替换全部文本<br>
			Esc: 离开编辑器<br>
		</div>
		<textarea id="code" name="code" rows="5" class="form-control"
			style="display: none" th:text="${file.content}"></textarea>
	</div>

	<div th:replace="base/foot_source"></div>

	<script th:src="@{/static/codemirror/lib/codemirror.js}"></script>

	<script th:src="@{/static/codemirror/addon/dialog/dialog.js}"></script>
	<script th:src="@{/static/codemirror/addon/search/searchcursor.js}"></script>
	<script th:src="@{/static/codemirror/addon/search/search.js}"></script>
	<script
		th:src="@{/static/codemirror/addon/scroll/annotatescrollbar.js}"></script>
	<script
		th:src="@{/static/codemirror/addon/search/matchesonscrollbar.js}"></script>
	<script th:src="@{/static/codemirror/addon/search/jump-to-line.js}"></script>
	<script th:src="@{/static/codemirror/addon/hint/show-hint.js}"></script>
	<script th:src="@{/static/codemirror/mode/javascript/javascript.js}"
		th:if="${file.ext == 'js' || file.ext == 'json'}"></script>
	<script th:src="@{/static/codemirror/addon/hint/javascript-hint.js}"
		th:if="${file.ext == 'js' || file.ext == 'json'}"></script>
	<script th:src="@{/static/codemirror/mode/css/css.js}"
		th:if="${file.ext == 'css'}"></script>
	<script th:src="@{/static/codemirror/addon/hint/css-hint.js}"
		th:if="${file.ext == 'css'}"></script>
	<script th:src="@{/static/codemirror/addon/display/fullscreen.js}"></script>
	<script th:src="@{/static/codemirror/addon/edit/matchbrackets.js}"></script>
	<script th:src="@{/static/codemirror/addon/selection/active-line.js}"></script>
	<script th:inline="javascript">
	var path = [[${file.path}]];
	var ext = [[${file.ext}]]
	</script>
	<script>
		var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
			lineNumbers : true,
			matchBrackets: true,
	        autoCloseBrackets: true,
	        styleActiveLine: true,
	        theme : 'eclipse',
			extraKeys : {
				"Alt-/" : "autocomplete",
				"Alt-F" : "findPersistent",
				"Ctrl-S" : function(){
					$.post(rootPath+'/mgr/static/edit',{path:path,content:editor.getValue()},function(data){
						bootbox.alert(data.message);
					});
				},
				"Esc" : function(){
					bootbox.confirm("确定要离开吗？这会丢失没有保存的内容",function(flag){
						if(flag){
							window.history.go(-1);
						}
					})
				}
			},
			fullScreen : true
		});
	</script>

</body>